<!-- 合约关闭 -->
<template>
  <div class="contract-close-wrap">
    <el-form ref="ruleForm"
             :model="ruleForm"
             :rules="rules"
             label-width="100px"
             class="demo-ruleForm">
      <el-form-item prop="reason"
                    class="item-width"
                    label="关闭原因">
        <nr-select v-model="ruleForm.reason"
                   :options="contractClosecause"
                   :props="{ label: 'label', value: 'value' }"
                   placeholder="请选择合约关闭原因" />
      </el-form-item>
      <el-form-item>
        <el-button type="default"
                   @click="handleCancel">取消</el-button>
        <el-button type="primary"
                   @click="handleSubmit">确定</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import nrSelect from "@/components/nr/select/Index";
import baseMixin from "@components/mount/mixins/common";
import axios from 'axios'
export default {
  name: "ContractClose",
  components: { nrSelect },
  mixins: [baseMixin],
  props: {
    data: Object,
    method: {
      type: String,
      default () {
        return "PUT"
      }
    },
    value: [],
    url: String,
    placeholder: {
      type: String,
      default () {
        return "请选择合约关闭原因";
      }
    },
    field: {
      type: String,
      default () {
        return "reason"
      }
    }
  },
  data () {
    return {
      contractClosecause: [
        { label: "合约价格有误", value: "合约价格有误" },
        { label: "合约价格调整", value: "合约价格调整" }
      ],
      rules: {
        reason: [
          { required: true, message: "请选择合约关闭原因", trigger: "change" }
        ]
      },
      disabled: false,
    };
  },
  methods: {
    async handleSubmit () {
      if (!this.ruleForm.reason) {
        this.$message({ type: 'error', message: this.placeholder })
        return
      }
      const reason = {
        ...this.data
      }
      reason[this.field] = this.ruleForm.reason;

      this.disabled = true;
      const { code, message } = await axios({
        method: this.method,
        url: this.url,
        data: reason,
      });
      this.disabled = false;
      if (0 !== code) {
        this.$message({ type: "error", message });
        return
      }
      this.$message({ type: "success", message });
      this.$emit("confirm", reason);
    },
    handleCancel () {
      this.$emit("cancel");
    }
  }
};
</script>

<style></style>
